:root {
  --primary: #26b0ff;
  --text-color: #fff;
  --text-color-secondary: #fff;
  --background: #000;
  --light-grey: rgba(0, 0, 0, 0.2);
  --light-bg-color--hover: rgba(255, 255, 255, 0.2);
  --medium-grey: rgba(255, 255, 255, 0.2);
  --very-light-grey: rgba(0, 0, 0, 0.4);
  --bright-bg-color: rgba(0, 0, 0, 0.2);
  --link-dark-color: #fff;
  --link-dark-color--hover: #26b0ff;

  --input-border: rgba(255, 255, 255, 0.2);
  --input-color: rgba(255, 255, 255, 0.1);
  --input-hidden-password-bg-color: rgba(255, 255, 255, 0.2);

  --header-link-outline: #fff;
  --header-bg-classic: none;
  --header-search-border: transparent;
  --header-link-bg-classic-hover: rgba(0, 0, 0, 0.2);

  --search-bg: #000;
  --search-input-color: #fff;

  --breadcrumbs-bg: none;
  --breadcrumbs-text-color: #fff;
  --breadcrumbs-border: rgba(255, 255, 255, 0.2);
  --breadcrumbs-item-bg-color--hover: rgba(0, 0, 0, 0.2);

  --task-link-bg-color--hover: rgba(0, 0, 0, 0.2);
  --task-link-bg-color--active: rgba(0, 0, 0, 0.2);

  --panel-border-color: rgba(255, 255, 255, 0.2);
  --panel-header-bg-color: rgba(0, 0, 0, 0.2);
  --pane-text-color: #fff;
  --pane-header-border-color: rgba(255, 255, 255, 0.2);

  --bigtable-header-bg: rgba(0, 0, 0, 0.2);
  --even-row-color: rgba(0, 0, 0, 0.1);
  --bigtable-row-border-color: rgba(255, 255, 255, 0.2);
  --table-striped-bg--hover: rgba(0, 0, 0, 0.2);

  --tab-link-text-color: #fff;
  --tab-link-border-color: transparent;
  --tab-link-bg--hover: rgba(0, 0, 0, 0.2);
  --tab-link-checked-bg: rgba(0, 0, 0, 0.3);
  --tab-link-border-width: 0;

  --btn-link-color--hover: #fff;
  --btn-link-bg--hover: rgba(0, 0, 0, 0.2);
  --focus-btn-primary: transparent;
  --btn-secondary-border: transparent;
  --btn-secondary-border--hover: transparent;
  --btn-secondary-border--focus: transparent;
  --focus-btn-secondary: transparent;

  --brightest-bg-color: rgba(255, 255, 255, 0.1);

  --menu-bg-color: #000;
  --menu-text-color: #fff;
  --menu-box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
  --menu-selected-color: rgb(40, 40, 40);

  --add-item-btn-decorator-bg-color: rgba(0, 0, 0, 0.2);
  --add-item-btn-decorator-border-color: rgba(255, 255, 255, 0.2);

  --manage-option-bg-color--hover: rgba(0, 0, 0, 0.2);
  --manage-option-border-color: rgba(255, 255, 255, 0.2);

  --plugin-manager-category-link-border-color: rgba(255, 255, 255, 0.2);
  --plugin-manager-category-link-bg-color: rgba(0, 0, 0, 0.2);
  --plugin-manager-category-link-bg-color--hover: rgba(255, 255, 255, 0.2);
  --plugin-manager-category-link-border-color--hover: rgba(255, 255, 255, 0.2);
  --plugin-manager-category-link-color--hover: #fff;

  --configure-job-bottom-sticker-border-color: rgba(255, 255, 255, 0.2);
  --configure-job-bottom-sticker-bg-color: rgba(0, 0, 0, 0.2);
}

body {
  background: url("https://bing-wallpaper.top/today.jpg") no-repeat center
    center;
  background-size: cover;
  background-attachment: fixed;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.8);
  &::after {
    content: " ";
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    backdrop-filter: blur(20px);
    z-index: -1;
    background: rgba(0, 0, 0, 0.4);
  }
}

input,
textarea,
select {
  border: 1px solid rgba(255, 255, 255, 0.2);
  padding: 4px 6px;
  border-radius: 2px;
  outline: none;
  transition: all 0.3s;
}
input::placeholder {
  color: rgba(255, 255, 255, 0.8);
}

a {
  transition: all 0.3s;
}

#header {
  #searchform {
    color: rgba(255, 255, 255, 0.8);
    .main-search__icon-trailing {
      color: rgba(255, 255, 255, 0.8);
    }
  }
  #search-box {
    border-width: 1px;
    transition: all 0.3s;
  }
}
#breadcrumbBar {
  .breadcrumbs__wrapper {
    background: rgba(0, 0, 0, 0.1);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(20px);
  }
}

#side-panel {
  .task-link:link:focus,
  .task-link:visited:focus {
    box-shadow: none;
  }
}

#main-panel {
  #description-link {
    color: #fff;
    img {
      transform: translate(-5px, -2px);
    }
  }
}

#add-item-panel {
  .add-item-name .input-help {
    color: #fff;
  }
}

#jenkins {
  table.bigtable {
    td {
      a {
        color: #fff;
      }
    }
  }
  .alert {
    text-shadow: none;
    a {
      color: inherit;
    }
  }

  a.yui-button {
    &.link-button {
      color: #fff;
      &:hover,
      &:focus {
        border-color: transparent;
      }
    }
  }
  .yuimenuitem {
    text-shadow: none;
  }
  .section-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    padding-bottom: 10px;
  }
  .healthReport:hover div.healthReportDetails,
  .healthReport.hover div.healthReportDetails {
    background-color: #000;
    border: 1px solid rgba(255, 255, 255, 0.2);
  }

  .bottom-sticker-inner {
    background: rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(20px);
  }

  .subtasks {
    .task:last-of-type {
      border-bottom: none;
      border-top: none;
    }
  }
  .jenkins-config-widgets {
    .config-section-activators {
      backdrop-filter: blur(20px);
    }
  }

  .help {
    border-color: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
  }
}

.yui-skin-sam {
  .yui-panel {
    background-color: #000;
    border-color: rgba(255, 255, 255, 0.2);
    .hd {
      color: #fff;
      background: transparent;
      border-color: rgba(255, 255, 255, 0.2);
    }
    .bd {
      background-color: transparent;
    }
  }
  .yuimenu {
    .topscrollbar,
    .bottomscrollbar {
      background-color: #000;
      border-color: rgba(255, 255, 255, 0.2);
    }
    .topscrollbar {
      background-position: center -975px;
      &.topscrollbar_disabled {
        background-position: center -950px;
      }
    }
    .bottomscrollbar {
      background-position: center -875px;
      &.bottomscrollbar_disabled {
        background-position: center -850px;
      }
    }
  }
}
